import React from 'react'
import { Layout, Menu } from 'antd'
import { NavLink, useLocation } from 'react-router-dom'
const { Header } = Layout

function AppHeader() {
  const location = useLocation()
  const menuItems = [
    { key: "/", label: <NavLink to="/">商品列表</NavLink> },
    { key: "/orders", label: <NavLink to="/orders">订单管理</NavLink> }
  ]

  return (
    <Header>
      <Menu theme='dark' mode='horizontal' items={menuItems} selectedKeys={[location.pathname]} />
    </Header>
  )
}

export default AppHeader